<template>

  <div>
    <el-card class="box-card">
      <el-button
        class="btn-add"
        @click="handleAddProduct()"
        size="mini">
        添加
      </el-button>
      <el-input
        style="width: 300px"
        placeholder="请输入内容"
        v-model="input"
        clearable
        size="mini">
      </el-input>
      <el-button
        class="btn-add"
        @click="quzzyQuery()"
        size="mini">
        查询
      </el-button>
      <!--<admin-add v-if="dialogSaveVisible" :visible.sync="dialogSaveVisible" :close="closeAdd" ></admin-add>-->
    </el-card>

    <el-table ref="productTable"
              style="width: 100%"
              :data="merchantList"
              border>

      <!--<el-table-column label="奇怪的东西" width="120" align="center">
        <template slot-scope="scope">
          <el-button
            size="mini"
            @click="userFootAttention(scope.$index, scope.row)">子账号
          </el-button>
        </template>
      </el-table-column>-->


      <!-- <el-table-column type="selection" width="60" align="center"></el-table-column>-->
      <el-table-column label="店铺编号" width="100" prop="merchantId" align="center">
      </el-table-column>
      <el-table-column label="店铺公告" width="100" prop="merchantNotice" align="center">
      </el-table-column>
      <el-table-column label="店铺头像" width="120" align="center" prop="userPhoto">
        <template slot-scope="scope"><img style="height: 80px" :src="scope.row.merchantLogoImg"></template>
      </el-table-column>
      <el-table-column label="店铺描述" width="100" prop="merchantDesc" align="center">
      </el-table-column>
      <el-table-column label="店铺评分" width="100" prop="merchantScore" align="center">
      </el-table-column>
      <el-table-column label="店铺关注数" width="100" prop="merchantAttention" align="center">
      </el-table-column>
      <el-table-column label="店铺账号" width="120" prop="merchantAccount" align="center">
      </el-table-column>
      <el-table-column label="店铺密码" width="120" prop="merchantPassword" align="center">
      </el-table-column>
      <el-table-column label="店主手机号" width="100" prop="shopkeeperPhoneNumber" align="center">
      </el-table-column>
      <el-table-column label="店主名称" width="100" prop="shopkeeperName" align="center">
      </el-table-column>
      <el-table-column label="店铺名称" width="100" prop="merchantName" align="center">
      </el-table-column>
      <el-table-column label="店主身份证号" width="100" prop="shopkeeperCardId" align="center">
      </el-table-column>
      <el-table-column label="店铺营业执照" width="120" align="center" prop="userPhoto">
        <template slot-scope="scope"><img style="height: 80px" :src="scope.row.licenseImg"></template>
      </el-table-column>

      <el-table-column label="店主身份证头像面" width="120" align="center" prop="userPhoto">
        <template slot-scope="scope"><img style="height: 80px" :src="scope.row.reverseCardImg"></template>
      </el-table-column>

      <el-table-column label="身份证反面" width="120" align="center" prop="userPhoto">
        <template slot-scope="scope"><img style="height: 80px" :src="scope.row.siteCardImg"></template>
      </el-table-column>

      <el-table-column label="店铺主营类目编号" width="100" prop="merchantKindsId" align="center">
      </el-table-column>
      <el-table-column label="店铺类型编号" width="100" prop="merchantTypeId" align="center">
      </el-table-column>
      <el-table-column label="审核人账号" width="100" prop="checkAdminAccount" align="center">
      </el-table-column>

      <el-table-column label="店铺地址编号" width="100" prop="merchantSiteId" align="center">
      </el-table-column>


      <el-table-column label="店铺状态" width="150" prop="merchantStatusId" align="center">

      </el-table-column>



      <el-table-column label="入驻时间" width="100" prop="enterTime" align="center">
      </el-table-column>
      <el-table-column label="钱包密码" width="100" prop="bursePassword" align="center">
      </el-table-column>
      <el-table-column label="钱包余额" width="100" prop="burseBalance" align="center">
      </el-table-column>
      <el-table-column label="店铺关键字" width="100" prop="merchantKeyword" align="center">
      </el-table-column>

      <el-table-column label="创建人" width="100" prop="createBy" align="center">
      </el-table-column>
      <el-table-column label="创建时间" width="100" prop="createTime" align="center">
      </el-table-column>
      <el-table-column label="更新人" width="100" prop="updateBy" align="center">
      </el-table-column>
      <el-table-column label="更新时间" width="100" prop="updateTime" align="center">
      </el-table-column>
      <el-table-column label="身份证证件期效" width="100" prop="cardCertificate" align="center">
      </el-table-column>
      <el-table-column label="身份证结束时间" width="100" prop="cardEndTime" align="center">
      </el-table-column>
      <el-table-column label="执照证件期效" width="100" prop="licenseCertifIcate" align="center">
      </el-table-column>
      <el-table-column label="执照结束时间" width="100" prop="licenseEndTime" align="center">
      </el-table-column>



      <el-table-column label="操作" width="200" align="center">
        <template slot-scope="scope">
          <!--<el-button
            size="mini"
            @click="handleShowProduct(scope.$index, scope.row)">查看
          </el-button>-->
            <el-button
              size="mini"
              @click="handleUpdateProduct( scope.row)">编辑
            </el-button>
            <!--<admin-update v-if="merchantUpdate" :visible.sync="merchantUpdate" :updateClose="closeUpdate" :merchant="merchantUser"></admin-update>-->
          <el-popconfirm
            title="确定修改吗"
            @onConfirm="handleDelete(scope.$index, scope.row)"
          >
            <el-button
              slot="reference"
              size="mini"
              type="danger"
            >修改状态
            </el-button>
          </el-popconfirm>

        </template>
      </el-table-column>
    </el-table>

    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="this.page.currentPage"
      layout="total, prev, pager, next, jumper"
      :total="this.page.total">
    </el-pagination>


    <!-- 添加 -->

    <el-dialog title="添加" :visible.sync="dialogSaveVisible">
      <el-form :model="dialogMerchantSave" :rules="rules" ref="ref">

        <el-form-item label="店主手机号" :label-width="formLabelWidth" required="required" prop="shopkeeperPhoneNumber">
          <el-input v-model="dialogMerchantSave.shopkeeperPhoneNumber"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店主名称" :label-width="formLabelWidth" required="required"  prop="shopkeeperName">
          <el-input v-model="dialogMerchantSave.shopkeeperName" autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店铺名称" :label-width="formLabelWidth" required="required"  prop="merchantName">
          <el-input v-model="dialogMerchantSave.merchantName"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店主身份证号" :label-width="formLabelWidth" required="required" prop="shopkeeperCardId">
          <el-input v-model="dialogMerchantSave.shopkeeperCardId"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="身份证头像面" :label-width="formLabelWidth" required="required">
          <el-upload
            class="avatar-uploader"
            action="http://localhost:8001/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess"
            :before-upload="beforeAvatarUpload">
            <img v-if="reverseCardImg" :src="reverseCardImg" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>

        <el-form-item label="身份证国徽面" :label-width="formLabelWidth" required="required">
          <el-upload
            class="avatar-uploader"
            action="http://localhost:8001/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess1"
            :before-upload="beforeAvatarUpload">
            <img v-if="siteCardImg" :src="siteCardImg" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>


        <el-form-item label="店主营业执照" :label-width="formLabelWidth" required="required">
          <el-upload
            class="avatar-uploader"
            action="http://localhost:8001/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess2"
            :before-upload="beforeAvatarUpload">
            <img v-if="licenseImg" :src="licenseImg" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>

        <el-form-item label="审核人账号" :label-width="formLabelWidth" prop="userPhoneNumber">
          <el-input v-model="dialogMerchantSave.checkAdminAccount" autocomplete="off" readonly></el-input>
        </el-form-item>

        <el-form-item label="创建人" :label-width="formLabelWidth" prop="cardId">
          <el-input v-model="dialogMerchantSave.createBy" autocomplete="off" readonly></el-input>
        </el-form-item>

        <el-form-item label="更新人" :label-width="formLabelWidth" prop="cardId">
          <el-input v-model="dialogMerchantSave.updateBy" autocomplete="off" readonly></el-input>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogSaveVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogUserSaveTure()">确 定</el-button>
      </div>
    </el-dialog>




    <!-- 修改 -->
    <el-dialog title="修改" :visible.sync="merchantUpdate">
      <el-form :model="merchantClone" :rules="rules" ref="ref">

        <el-form-item label="店铺编号" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.merchantId"  autocomplete="off" readonly></el-input>
        </el-form-item>

        <el-form-item label="店铺头像" :label-width="formLabelWidth" required="required">
          <el-upload
            class="avatar-uploader"
            action="http://localhost:8001/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess3"
            :before-upload="beforeAvatarUpload">
            <img v-if="merchantLogoImg" :src="merchantLogoImg" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>

        <el-form-item label="店铺公告" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.merchantNotice"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店铺描述" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.merchantDesc"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店铺评分" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.merchantScore"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店铺关键数" :label-width="formLabelWidth">
          <el-input v-model="merchantClone.merchantAttention"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店铺账号" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.merchantAccount"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店铺密码" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.merchantPassword"  autocomplete="off"></el-input>
        </el-form-item>


        <el-form-item label="店主手机号" :label-width="formLabelWidth" required="required" prop="shopkeeperPhoneNumber">
          <el-input v-model="merchantClone.shopkeeperPhoneNumber"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店主名称" :label-width="formLabelWidth" required="required"  prop="shopkeeperName">
          <el-input v-model="merchantClone.shopkeeperName" autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店铺名称" :label-width="formLabelWidth" required="required"  prop="merchantName">
          <el-input v-model="merchantClone.merchantName"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="店主身份证号" :label-width="formLabelWidth" required="required" prop="shopkeeperCardId">
          <el-input v-model="merchantClone.shopkeeperCardId"  autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="身份证头像面" :label-width="formLabelWidth" required="required">
          <el-upload
            class="avatar-uploader"
            action="http://localhost:8001/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess"
            :before-upload="beforeAvatarUpload">
            <img v-if="reverseCardImg" :src="reverseCardImg" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>

        <el-form-item label="身份证国徽面" :label-width="formLabelWidth" required="required">
          <el-upload
            class="avatar-uploader"
            action="http://localhost:8001/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess1"
            :before-upload="beforeAvatarUpload">
            <img v-if="siteCardImg" :src="siteCardImg" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>


        <el-form-item label="店主营业执照" :label-width="formLabelWidth" required="required">
          <el-upload
            class="avatar-uploader"
            action="http://localhost:8001/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess2"
            :before-upload="beforeAvatarUpload">
            <img v-if="licenseImg" :src="licenseImg" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>

        <el-form-item label="店铺主营类目编号" :label-width="formLabelWidth">
          <el-input v-model="merchantClone.merchantKindsId" autocomplete="off" ></el-input>
        </el-form-item>

        <el-form-item label="店铺类型编号" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.merchantTypeId" autocomplete="off" ></el-input>
        </el-form-item>

        <el-form-item label="审核人账号" :label-width="formLabelWidth" prop="checkAdminAccount">
          <el-input v-model="merchantClone.checkAdminAccount" autocomplete="off" readonly></el-input>
        </el-form-item>

        <el-form-item label="店铺地址编号" :label-width="formLabelWidth">
          <el-input v-model="merchantClone.merchantSiteId" autocomplete="off" ></el-input>
        </el-form-item>

        <el-form-item label="入驻时间" :label-width="formLabelWidth">
          <el-date-picker
            v-model="merchantClone.enterTime"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="钱包密码" :label-width="formLabelWidth">
          <el-input v-model="merchantClone.bursePassword" autocomplete="off" ></el-input>
        </el-form-item>

        <el-form-item label="钱包余额" :label-width="formLabelWidth">
          <el-input v-model="merchantClone.burseBalance" autocomplete="off" ></el-input>
        </el-form-item>

        <el-form-item label="店铺关键字" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.merchantKeyword" autocomplete="off" ></el-input>
        </el-form-item>

        <el-form-item label="创建人" :label-width="formLabelWidth" prop="cardId">
          <el-input v-model="merchantClone.createBy" autocomplete="off" readonly></el-input>
        </el-form-item>

        <el-form-item label="创建时间" :label-width="formLabelWidth">
          <el-date-picker
            v-model="merchantClone.createTime"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="更新人" :label-width="formLabelWidth" prop="cardId">
          <el-input v-model="merchantClone.updateBy" autocomplete="off" readonly></el-input>
        </el-form-item>

        <el-form-item label="更新时间" :label-width="formLabelWidth">
          <el-date-picker
            v-model="merchantClone.updateTime"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="身份证证件期效" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.cardCertificate" autocomplete="off" ></el-input>
        </el-form-item>

        <el-form-item label="身份证结束时间" :label-width="formLabelWidth">
          <el-date-picker
            v-model="merchantClone.cardEndTime"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="执照证件期效" :label-width="formLabelWidth" >
          <el-input v-model="merchantClone.licenseCertifIcate" autocomplete="off" ></el-input>
        </el-form-item>

        <el-form-item label="执照结束时间" :label-width="formLabelWidth">
          <el-date-picker
            v-model="merchantClone.licenseEndTime"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="merchantUpdate = false">取 消</el-button>
        <el-button type="primary" @click="dialogUserUpdateTure()">确 定</el-button>
      </div>
    </el-dialog>


  </div>
</template>

<script>
  import Cookie from "js-cookie"
  import axios from "axios"
  export default {
    name: "merchant",
    data() {
      return{
        merchantLogoImg:'',
        merchantClone:[],
        merchantUser:{},
        merchantUpdate: false,
        licenseImg:'',
        siteCardImg:'',
        reverseCardImg: '',
        dialogMerchantSave:{},
        dialogSaveVisible: false,
        formLabelWidth: '120px',
        merchantList: [],
        input: '',
        mo: false,
        page: {
          currentPage:1,
          total: 0,
          page: 0,
          rows: 10,
        },
        rules: {
          shopkeeperPhoneNumber:[
            {pattern: /^[1][3,4,5,7,8][0-9]{9}$/, message: '手机号格式不正确', prop: true}
          ],
          shopkeeperCardId:[
            { pattern: /(^\d{15}$)|(^\d{17}(\d|X|x)$)/, message: '身份证格式不正确' }
          ],
        }
      }
    },
    created () {
        this.getList();
    },
    methods: {
      closeUpdate(){
        this.merchantUpdate = false;
      },
      getList(){
        axios.get("http://localhost:8001/business",{
          params: {
            page: 1,
            rows: 10
          }
        }).then(result => {
          this.merchantList = result.data.records;

          console.log(this.merchantList);

          for (let merchantListElement of this.merchantList) {

            if (merchantListElement.merchantStatusId == 1){
              merchantListElement.merchantStatusId = '启用';
            } else if (merchantListElement.merchantStatusId == 0){
              merchantListElement.merchantStatusId = '禁用';
            }else{
              merchantListElement.merchantStatusId = '未审核';
            }
          }


        });
      },


      // 初始页currentPage、初始每页数据数pagesize和数据data
      handleSizeChange: function (size) {
        this.page.rows = size;
        console.log(this.page.rows)  //每页下拉显示数据
      },
      handleCurrentChange: function(currentPage){
        this.page.currentPage = currentPage;
        this.page.page=(currentPage*this.page.rows)-this.page.rows
        if(this.mo==true){
          this.quzzyQuery()
        }else{
          this.getList();
        }
        console.log(this.page.currentPage)  //点击第几页
      },


      /* 增加 */
      dialogUserSaveTure(){
        this.$refs["ref"].validate((jy)=>{
          if (!jy) return

          axios.get("http://localhost:8001/business/findPhone",{
            params: {
              value: this.dialogMerchantSave.shopkeeperPhoneNumber
            }
          }).then(result => {

            if (result.data != null && result.data != ""){
              this.$message({
                message: '该手机号已被使用'
              });
            }else{

              let data = {
                shopkeeperPhoneNumber: this.dialogMerchantSave.shopkeeperPhoneNumber,
                shopkeeperName: this.dialogMerchantSave.shopkeeperName,
                merchantName: this.dialogMerchantSave.merchantName,
                shopkeeperCardId: this.dialogMerchantSave.shopkeeperCardId,
                reverseCardImg: this.reverseCardImg,
                siteCardImg: this.siteCardImg,
                licenseImg: this.licenseImg,
                checkAdminAccount: this.dialogMerchantSave.checkAdminAccount,
                merchantKeyword: this.dialogMerchantSave.merchantKeyword,
                createBy: this.dialogMerchantSave.createBy,
                updateBy: this.dialogMerchantSave.updateBy
              };
              this.$axios({
                method: 'post',
                url:'http://localhost:8001/business',
                data: data,
              }).then( data => {
                if (data){
                  this.$message({
                    message: '添加成功'
                  });
                  this.getList();
                }else{
                  this.$message({
                    message: '添加失败'
                  });
                }
                this.dialogSaveVisible = false;
              }).catch((e) => {});
            }
          });
        })
      },

      handleAddProduct: function () {
        let admin = Cookie.get("admin")
        let adminAccount = JSON.parse(admin).adminAccount
        this.dialogMerchantSave.checkAdminAccount = adminAccount;
        this.dialogMerchantSave.updateBy = adminAccount;
        this.dialogMerchantSave.createBy = adminAccount;
          this.dialogSaveVisible = true
      },

      /* 搜索栏 */
      quzzyQuery(){
          axios.get("http://localhost:8001/business/accountVague",{
            params: {
              value: this.input
            }
          }).then( result => {
            if (result.data == null || result.data == ""){
              this.$message({
                message: '未查询到相关数据'
              });
              this.getList();
            }else{
              this.merchantList = result.data;
              for (let merchantListElement of this.merchantList) {
                if (merchantListElement.merchantStatusId == 1){
                  merchantListElement.merchantStatusId = '启用';
                } else if (merchantListElement.merchantStatusId == 0){
                  merchantListElement.merchantStatusId = '禁用';
                }else{
                  merchantListElement.merchantStatusId = '未审核';
                }
              }
            }
          })
      },


      /* 修改 */
      handleUpdateProduct(row){
        this.merchantUpdate = true; // 开启

        // 克隆
        this.merchantUser = row;
        this.merchantClone = row;
        this.merchantClone = Object.assign({}, row);

        let admin = Cookie.get("admin")
        let adminAccount = JSON.parse(admin).adminAccount
        // 审核人和创建人
        /*this.merchantClone.checkAdminAccount = adminAccount;
        this.merchantClone.createBy = adminAccount;*/
        this.merchantClone.updateBy = adminAccount;

        this.merchantLogoImg = row.merchantLogoImg;
        this.reverseCardImg = row.reverseCardImg;
        this.siteCardImg = row.siteCardImg;
        this.licenseImg = row.licenseImg;

      },
      dialogUserUpdateTure(){
        this.$refs["ref"].validate((jy)=> {
          if (!jy) return

          axios.get('http://localhost:8001/business/findPhone',{
            params: {
              value: this.merchantClone.shopkeeperPhoneNumber
            }
          }).then( result => {
            if (result.data == "" || result.data.shopkeeperPhoneNumber == this.merchantUser.shopkeeperPhoneNumber){
              let data = {
                merchantId: this.merchantClone.merchantId,
                merchantLogoImg: this.merchantLogoImg,
                merchantNotice: this.merchantClone.merchantNotice,
                merchantDesc: this.merchantClone.merchantDesc,
                merchantScore: this.merchantClone.merchantScore,
                merchantAttention: this.merchantClone.merchantAttention,
                merchantAccount: this.merchantClone.merchantAccount,
                merchantPassword: this.merchantClone.merchantPassword,
                shopkeeperPhoneNumber: this.merchantClone.shopkeeperPhoneNumber,
                shopkeeperName: this.merchantClone.shopkeeperName,
                merchantName: this.merchantClone.merchantName,
                shopkeeperCardId: this.merchantClone.shopkeeperCardId,
                reverseCardImg: this.reverseCardImg,
                siteCardImg: this.siteCardImg,
                licenseImg: this.licenseImg,
                merchantKindsId: this.merchantClone.merchantKindsId,
                merchantTypeId: this.merchantClone.merchantTypeId,
                checkAdminAccount: this.merchantClone.checkAdminAccount,
                merchantSiteId: this.merchantClone.merchantSiteId,
                enterTime: this.merchantClone.enterTime,
                bursePassword: this.merchantClone.bursePassword,
                burseBalance: this.merchantClone.burseBalance,
                merchantKeyword: this.merchantClone.merchantKeyword,
                createBy: this.merchantClone.createBy,
                createTime: this.merchantClone.createTime,
                updateBy: this.merchantClone.updateBy,
                updateTime: this.merchantClone.updateTime,
                cardCertificate: this.merchantClone.cardCertificate,
                cardEndTime: this.merchantClone.cardEndTime,
                licenseCertifIcate: this.merchantClone.licenseCertifIcate,
                licenseEndTime: this.merchantClone.licenseEndTime
              };

              this.$axios({
                method: 'put',
                url: 'http://localhost:8001/business',
                data: data
              }).then( data => {
                if (data){
                  this.$message({
                    message: '修改成功'
                  });
                  this.merchantUpdate = false;
                }else{
                  this.$message({
                    message: '修改失败'
                  });
                }
                this.getList();
              });
            }else{
              this.$message({
                message: '该手机号已被使用'
              });
            }
          });
        })
      },


      /* 删除 */
      handleDelete(index,row){

        let admin = Cookie.get("admin")
        let adminAccount = JSON.parse(admin).adminAccount


        // 启用为 1
        if (row.merchantStatusId == "启用"){

          let data = {
            merchantId: row.merchantId,
            merchantStatusId: 0,
            updateBy: adminAccount
          };
          this.$axios({
            method: 'put',
            url: 'http://localhost:8001/business',
            data: data
          }).then( result => {

            if (result){
              this.$message({
                message: '修改完成'
              });
            }else{
              this.$message({
                message: '修改失败'
              });
            }
          });
          // 禁用为 0
        }else if (row.merchantStatusId == "禁用"){

          let data = {
            merchantId: row.merchantId,
            merchantStatusId: 1,
            updateBy: adminAccount
          };
          this.$axios({
            method: 'put',
            url: 'http://localhost:8001/business',
            data: data
          }).then( result => {

            if (result){
              this.$message({
                message: '修改完成'
              });
            }else{
              this.$message({
                message: '修改失败'
              });
            }
          });

        }else{
          this.$message({
            message: '未审核状态无法修改'
          })
        }
        this.getList();
      },
      handleAvatarSuccess(res, file) {
        this.reverseCardImg = res;
        console.log("1:---"+this.reverseCardImg);
      },
      handleAvatarSuccess1(res,file){
        this.siteCardImg = res;
        console.log("2:----"+this.siteCardImg)
      },
      handleAvatarSuccess2(res,file){
        this.licenseImg = res;
        merchantLogoImg
        console.log("3:---"+this.licenseImg);
      },
      handleAvatarSuccess3(res,file){
        this.merchantLogoImg = res;
        console.log("4:---"+this.merchantLogoImg);
      },
      beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg';
        const isLt2M = file.size / 1024 / 1024 < 1;

        if (!isJPG) {
          this.$message.error('上传图片只能是 JPG 格式!');
        }
        if (!isLt2M) {
          this.$message.error('上传图片大小不能超过 1MB!');
        }
        return isJPG && isLt2M;
      }
    },
    }

</script>

<style scoped>
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>
